<!DOCTYPE html>
<html>
<head>
    {% load static %}
<title>Contact</title>
<link href="{% static "news/css/bootstrap.css" %}" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="{% static "news/js/jquery.min.js" %}"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="{% static "news/css/style.css" %}" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Inspired Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.useso.com/css?family=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
<!--//fonts-->
<script type="text/javascript" src="{% static "news/js/move-top.js" %}"></script>
<script type="text/javascript" src="{% static "news/js/easing.js" %}"></script>
				<script type="text/javascript">
					jQuery(document).ready(function($) {
						$(".scroll").click(function(event){		
							event.preventDefault();
							$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
						});
					});
					</script>

</head>
<body>
	<!--header-->
	<div class="container">
	<div class="header">
		<div class="header-top">
			<div class="logo">
				<a href="{% url "NewsIndex" %}"><img src="{% static "news/images/logo.png" %}" alt="" ></a>
			</div>
			<div class="header-top-on">
				<ul class="social-in">
					<li><span>Share This Page:</span></li>
					<li><a href="#"><i> </i></a></li>						
					<li><a href="#"><i class="tin"> </i></a></li>
					<li><a href="#"><i class="message"> </i></a></li>
					<li><a href="#"><i class="youtube"> </i></a></li>
				</ul>
			</div>
				<div class="clearfix"> </div>
			</div>
			<!---->
			<div class="header-bottom">
				<div class="top-nav">
					<span class="menu"> </span>
					<ul>
						<li  ><a href="{% url "NewsIndex" %}" data-hover="HOME" >HOME  </a> </li>
						<li><a href="{% url "NewsEvents" %}" data-hover="EVENTS" > EVENTS</a></li>
						<li><a href="{% url "NewsSearch" %}" data-hover="SEARCH"> SEARCH </a></li>
						<li><a href="{% url "NewsCategory" %}" data-hover="CATEGORY"> CATEGORY</a></li>
						<li ><a href="{% url "NewsRegister" %}" data-hover="REGISTER">REGISTER </a></li>
						{% if not user.is_authenticated %}
						<li><a href="{% url "NewsLogin" %}" data-hover="LOGIN">LOGIN </a></li>
                        {% else %}
                        <li><a href="{% url "user_logout" %}" data-hover="LOGOUT">LOGOUT </a></li>
                        {% endif %}
					</ul>
					<!--script-->
				<script>
					$("span.menu").click(function(){
						$(".top-nav ul").slideToggle(500, function(){
						});
					});
			</script>
				</div>
					<div class="search">
						<form action="{% url "NewsSearchView" %}" method="get">
							<input type="text" placeholder="Search" name="search">
							<input type="submit" value="">
						</form>
					</div>
			<div class="clearfix"> </div>
		</div>
	</div>
</div>
		<!---->
	<div class="container">
		<div class="contact">
			<div class="col-md-7 contact-para">
			<p class="class-para">如果你有什么意见可以向我们反映</p>
			<h5>CONTACT US</h5>
			<form>
				<div class="grid-contact">
					<div class="col-md-6 contact-grid">
						<p >FIRST NAME</p>		
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">						
						</div>
					<div class="col-md-6 contact-grid">
						<p >LAST NAME</p>		
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">						
						</div>
					<div class="clearfix"> </div>
				</div>
				<div class="grid-contact">
					<div class="col-md-6 contact-grid">
					<p >E-MAIL ADDRESS</p>						
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">							
					</div>
					<div class="col-md-6 contact-grid">						
					<p >TELEPHONE</p>						
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">							
						</div>
					<div class="clearfix"> </div>
				</div>
					<p class="your-para">MESSAGE</p>
					<textarea cols="77" rows="6" value=" " onfocus="this.value='';" onblur="if (this.value == '') {this.value = '';}"></textarea>
						<div class="send">
							<input type="submit" value="SEND" >
						</div>
			</form>
			</div>	
			<div class="col-md-5 contact-map">
			<h5>AMAP-MAP</h5>
			<div class="map">
				<iframe src="https://www.amap.com/"></iframe>

			</div>
			</div>
			<div class="clearfix"> </div>
		</div>	
	</div>	
		<!---->	
		<div class="container">
		<div class="footer">
			<div class="footer-top">
				<div class="col-md-4 amet-sed">
				<h4>navigation</h4>
				<i class="line"> </i>
					<ul class="nav-bottom">
						<li  ><a href="{% url "NewsIndex" %}" >HOME  </a> </li>
						<li><a href="{% url "NewsEvents" %}" > EVENTS</a></li>
						<li><a href="{% url "NewsSearch" %}"> SEARCH </a></li>
						<li><a href="{% url "NewsCategory" %}" > CATEGORY</a></li>
						<li><a href="{% url "NewsRegister" %}">REGISTER </a></li>
						{% if not user.is_authenticated %}
						<li><a href="{% url "NewsLogin" %}">LOGIN </a></li>
                        {% else %}
                        <li><a href="{% url "user_logout" %}">LOGOUT </a></li>
                        {% endif %}
						<li  ><a href="#" >RSVP</a> </li>
						<li><a href="#" >PRIVACY POLICY</a></li>
					</ul>
				</div>
				<div class="col-md-4 amet-sed ">
				<h4>get in touch</h4>
				<i class="line"> </i>
					<ul class="nav-bottom">
						<li  ><a href="{% url "NewsContact" %}" >CONTACT US</a> </li>
						<li><a href="#" >PRIVACY POLICY</a></li>
						<li><a href="#">TERMS &amp; CONDITIONS </a></li>					
					</ul>
					<p>Email: <a href="mailto:info@example.com">info@example.com</a></p>
				</div>
				<div class="col-md-4 amet-sed ">
				<h4>share this page</h4>
				<i class="line"> </i>
				<ul class="social-in msg-social">
					<li><a href="#"><i> </i></a></li>						
					<li><a href="#"><i class="tin"> </i></a></li>
					<li><a href="#"><i class="message"> </i></a></li>
					<li><a href="#"><i class="youtube"> </i></a></li>
				</ul>
				<p>follow us on twitter:<a href="#">@example</a></p>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
		 <script type="text/javascript">
						$(document).ready(function() {
							/*
							var defaults = {
					  			containerID: 'toTop', // fading element id
								containerHoverID: 'toTopHover', // fading element hover id
								scrollSpeed: 1200,
								easingType: 'linear' 
					 		};
							*/
							
							$().UItoTop({ easingType: 'easeOutQuart' });
							
						});
					</script>
				<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
	</div>
</body>
</html>